<%@ include file="/common/taglibs.jsp"%>
<%@ taglib tagdir="/WEB-INF/tags/catalog" prefix="catalog"%>
<probiz:pageHeading entityName="${advertisement.advertisementName}" entityHeadingKey="advertisementDetail.heading" />

<probiz:showBindErrors bindPath="advertisement.*" />
<content tag="buttons">
   <probiz:iconBtn btnType="save" onclick="fnDoSave(this, 'positionName')" />
	<c:if test="${advertisement.advertisementId!=null}">
		<probiz:iconBtn btnType="delete" onclick="fnDoDelete(this, 'advertisementName')" />
	</c:if>
	<probiz:iconBtn btnType="back" url="${ctxPath}/content/advertisement.html" />
</content>

<form class="mainForm" method="post" action="${ctxPath}/content/advertisement.html" name="advertisement" id="advertisement" onsubmit="return preSaveAdvertisement(this);">
	<div class="top clearfix">
		<ul class="tab">
			<li class="curr"><span><fmt:message key="advertisementDetail.title"/></span></li>
		</ul>
	</div>
    <div class="modify"> 
		<table class="com_modi_table" cellSpacing=0 cellPadding=0 width="100%" border=0>
			<tr>
				<th colspan="2" class="title"><h4><fmt:message key="advertisementDetail.group.basic"/><h4></th>
			</tr>
			<tr>
				<th class="label_width_1">
					<StoreAdmin:label key="advertisement.advertisementName" />
				</th>
				<td>
					<input type="hidden" name="advertisementId"	value="${advertisement.advertisementId}" />
					<input style="width:350px" class="inputtxt" type="text" name="advertisementName" id="advertisementName" value="${advertisement.advertisementName}" />
				</td>
			</tr>
			<tr>
				<th>
					<StoreAdmin:label key="advertisement.contentType" />
				</th>
				<td>
					<input type="radio" name="contentType" id="contentType" value="1" <c:if test="${empty advertisement.contentType or advertisement.contentType == 1}">checked</c:if>/><label for="contentType">&nbsp;<fmt:message key="advertisement.contentType.1"/></label>
					<input type="radio" name="contentType" id="contentType2" value="2" <c:if test="${advertisement.contentType == 2}">checked</c:if>/><label for="contentType2">&nbsp;<fmt:message key="advertisement.contentType.2"/></label>
				</td>
			</tr>
			<tr id="url4ImageTr" <c:if test="${advertisement.contentType == 2}">style="display:none;"</c:if>>
				<th>
					<StoreAdmin:label key="advertisement.url4Image" />(<span class="red">*</span>)
				</th>
				<td>
					<img id="advertisementImage" src="${mediaPath}${advertisement.url}"	onerror="$j(this).attr('originsrc',this.src);this.onerror='';this.src=__defaultImage"		originsrc="" height="150" width="150" />
					<br />
					<input class="inputtxt" type="hidden" name="url" id="url4Image" value="<c:if test="${advertisement.contentType == 1}">${advertisement.url}</c:if>" validConf="required,url"/>
				</td>
			</tr>
			<tr id="url4FlashTr" <c:if test="${empty advertisement.contentType or advertisement.contentType == 1}">style="display:none;"</c:if>>
				<th>
					<StoreAdmin:label key="advertisement.url4Flash" />(<span class="red">*</span>)
				</th>
				<td>
					<%--该flash必须支持WMode是Transparent的模式，否则该flash不能正常显示 --%>
					<input style="width:350px" readonly="true" class="inputtxt" type="text" name="url" id="url4Flash" value="<c:if test="${advertisement.contentType == 2}">${advertisement.url}</c:if>" validConf="required,url" />
				</td>
			</tr>

			<tr id="redirectUrlTr" <c:if test="${advertisement.contentType == 2}">style="display:none;"</c:if>>
				<th>
					<StoreAdmin:label key="advertisement.redirectUrl" />
				</th>
				<td>
					<input style="width:350px"  class="inputtxt" type="text" name="redirectUrl" id="redirectUrl" value="${advertisement.redirectUrl}" />
				</td> 
			</tr>
			<tr id="advertisementDetailTr" <c:if test="${advertisement.contentType == 2}">style="display:none;"</c:if>>
				<th>
					<StoreAdmin:label key="advertisement.advertisementDetail" />
				</th>
				<td>
					<textarea id="advertisementDetail" name="advertisementDetail" class="textareatxt" style="width:350px">${advertisement.advertisementDetail}</textarea>
				</td> 
			</tr>
			<tr>
				<th>
					<StoreAdmin:label key="advertisement.sortOrder" />
				</th>
				<td>
					<input style="width:50px" class="inputtxt" type="text" name="sortOrder" id="sortOrder" value="${(not empty advertisement.sortOrder)?advertisement.sortOrder:10}" />
				</td>
			</tr>
			<tr>
				<th colspan="2" class="title"><h4><fmt:message key="advertisementDetail.group.position"/><h4></th>
			</tr>
			<tr>
				<th>
					<StoreAdmin:label key="advertisement.adPositionTypeId" />
				</th>
				<td>
					<c:forEach var="adPositionType" items="${adPositionTypeList}">
						<input id="position${adPositionType.adPositionTypeId}" name=adPositionTypeId  type="radio" positionType="${adPositionType.positionType}"	value="${adPositionType.adPositionTypeId}"
                           <c:if test="${advertisement.adPositionTypeId == adPositionType.adPositionTypeId}">checked</c:if>  validConf="required"/>
                        <label for="position${adPositionType.adPositionTypeId}">${adPositionType.positionName} 
                        	(<fmt:message key="adPositionType.width"/>:${adPositionType.width}px,<fmt:message key="adPositionType.height"/>:${adPositionType.height}px, 
                        	<fmt:message key="adPositionType.displayType"/>:<fmt:message key="adPositionType.displayType.${adPositionType.displayType}"/>)</label>
                        <br /><br/>
					</c:forEach>
				</td>
			</tr>
			<tr id="relationTableTr" <c:if test="${empty advertisement.advertisementId or advertisement.adPositionType.positionType == 1}">style="display:none;"</c:if>>
				<th><fmt:message key="advertisement.productAdvertisements"/>:</th>
				<td>
					<table id="relationTable" name="relationTable" class="op_table" cellspacing="0" cellpadding="0" border="0" width="100%">
						<tr>
							<th style="width:40%"><fmt:message key="productAdvertisement.categoryName"/></th>
							<th style="width:20%"><fmt:message key="productAdvertisement.isSubIncluded"/></th>
							<th style="width:20%"><fmt:message key="productAdvertisement.operation"/></th>
							<th><a href="javascript:void(0)" onclick="showDialogOfproductCategorySelector()" class="none"><span class="add_sku"></span><fmt:message key="advertisementDetail.addRelateProductCategory"/></a></th>
						</tr>
						<tr id="relationTableEmptyTr">
							<td colspan="3">
								<fmt:message key="advertisementDetail.categoryEmpty">
									<fmt:param>showDialogOfproductCategorySelector()</fmt:param>
								</fmt:message>
							</td>
						</tr>
					</table>
				</td>
			</tr>
			
			<tr>
				<th colspan="2" class="title"><h4><fmt:message key="advertisementDetail.group.time"/><h4></th>
			</tr>
			<tr>
				<th >
					<label for="isShowCheck">
						<fmt:message key="advertisement.isShow" />:
					</label>
				</th>
				<td>
					<input type="checkbox" name="isShowCheck" id="isShowCheck" <c:if test="${empty advertisement.isShow || advertisement.isShow == 1}">checked</c:if>  onclick="if(this.checked){$('isShow').value=1;}else{$('isShow').value=0}">
					<label for="isShowCheck">
						<fmt:message key="advertisement.isShow.yes" />
					</label>	
					<input type="hidden" name="isShow" id="isShow" value="${(empty advertisement.isShow)?1:advertisement.isShow}">
				</td>
			</tr>
			<tr>
				<th>
					<StoreAdmin:label key="advertisement.startPublishTime" />
				</th>
				<td>
						<div style="float:left;">
						<form:input id="startPublishTime" path="advertisement.startPublishTime"  cssClass="inputtxt" size="10"/> 
						<probiz:ui_datePicker outPut="startPublishTime" />
						</div>
						<div id="startHourSpan" style="float:left; margin:3px 0 0 0;">
							<c:choose>
							<c:when test="${not empty advertisement.startHourShow}">
								<input class="ui-spinner"  id="startHour" name="startHour"  value="${advertisement.startHourShow}" readonly="true"/> 
							</c:when>
							<c:otherwise>
								<input class="ui-spinner" id="startHour" name="startHour"  value="0"/> 
							</c:otherwise>
							</c:choose>
						</div>
						<div style="float:left; padding:2px 0 0 2px;">
						<fmt:message key="advertisement.hour"/>
						<probiz:plugin_tip id="startTimeTip"><fmt:message key="advertisement.startPublishTime.tip" /></probiz:plugin_tip>
						</div>
				</td>
	
			</tr>
			
			<tr>
				<th>
					<StoreAdmin:label key="advertisement.endPublishTime" />
				</th>
				<td>
					<div style="float:left;">
						<form:input id="endPublishTime" path="advertisement.endPublishTime"  cssClass="inputtxt" size="10"/> 
						<probiz:ui_datePicker outPut="endPublishTime" />
					</div>
					<div id="endHourSpan" style="float:left; margin:3px 0 0 0;">
							<c:choose>
							<c:when test="${not empty advertisement.endHourShow}">
								<input class="ui-spinner"  id="endHour" name="endHour"  value="${advertisement.endHourShow}" readonly="true"/> 
							</c:when>
							<c:otherwise>
								<input class="ui-spinner" id="endHour" name="endHour"  value="0"/> 
							</c:otherwise>
							</c:choose>
					</div>
					<div style="float:left; padding:2px 0 0 2px;">
							<fmt:message key="advertisement.hour"/>
							<probiz:plugin_tip id="endTimeTip"><fmt:message key="advertisement.endPublishTime.tip" /></probiz:plugin_tip>
					</div>
				</td>
			</tr>
			
		</table>
	</div>
</form>

<c:set var="plugin_upload" value="true" scope="request"/>
<c:set var="ui_spinner" value="true" scope="request"/>
<v:javascript formName="advertisement" staticJavascript="false" />
<script type="text/javascript" src="${ctxPath}/scripts/probiz/content/advertisementForm.js?rs=${appConfig.rs}"></script>
<div style="display:none;">
	<catalog:productCategorySelector selectorId="productCategorySelector" callbackFunc="selectCategoryCallback"/>
</div>
<script type="text/javascript">
var hasInitImageUpload = false;
var hasInitFlashUpload = false;
$j(document).ready(function () {
	__FMTExtend = {
		advertisement_endTimeGtStartTime:"<fmt:message key="advertisement.endTimeGtStartTime"/>",
		advertisementDetail_addCategoryAlrady:"<fmt:message key="advertisementDetail.addCategoryAlrady"/>",
		advertisementDetail_cannotAddRoot:"<fmt:message key="advertisementDetail.cannotAddRoot"/>"
	
	};
	$j.extend(__FMT, __FMTExtend); 
	<c:choose>
		<c:when test="${advertisement.contentType == 2}">
			$j('#url4Image').attr("disabled",true);
			initFlashUploadUrl();
		</c:when>
		<c:otherwise>
			$j('#url4Flash').attr("disabled",true);
			initImageUploadUrl();
		</c:otherwise>
	</c:choose>
	
	//类型选择事件
	$j('input[name="contentType"]').click(function(){
		if(this.value == 1){
			$j('#url4ImageTr').show();			
			$j('#redirectUrlTr').show();			
			$j('#advertisementDetailTr').show();			
			$j('#url4FlashTr').hide();			
			$j('#url4Image').attr("disabled",false);
			$j('#url4Flash').attr("disabled",true);
			if(!hasInitImageUpload){
				initImageUploadUrl();
			}
		}else{
			$j('#url4ImageTr').hide();			
			$j('#redirectUrlTr').hide();			
			$j('#advertisementDetailTr').hide();			
			$j('#url4FlashTr').show();			
			$j('#url4Image').attr("disabled",true);
			$j('#url4Flash').attr("disabled",false);
			if(!hasInitFlashUpload){
				initFlashUploadUrl();
			}
		}
	});
	$j('input[name="adPositionTypeId"]').change(function(){
			var jAdPositionType = $j('input[name="adPositionTypeId"]:checked');
			if(jAdPositionType.attr("positionType") == 2){
				$j('#relationTableTr').show();
			}else{
				$j('#relationTableTr').hide();
			}
	});	
	
	applyValidate($("startHour"),"required,integer,minValue=0,maxValue=23");
    $j("#startHour").spinner({max: 23, min: 0});
    $j("#startHour").css({'font-size':"100%"});
    
    applyValidate($("endHour"),"required,integer,minValue=0,maxValue=23");
    $j("#endHour").spinner({max: 23, min: 0});
    $j("#endHour").css({'font-size':"100%"});
    
    <c:forEach items="${advertisement.productAdvertisements}" var="productAdv">
    	addRelation({"categoryId":${productAdv.categoryId},
    				 "categoryName":"${productAdv.productCategory.simpleCategoryPathName}",
    				 "isSubIncluded":${productAdv.isSubIncluded}});
    </c:forEach>
});

function initImageUploadUrl(){
	initUpload("url4Image","admedia","jpg,png,gif","",fnUploadImagehandler,'upload_img_1');
	hasInitImageUpload = true;
}
function initFlashUploadUrl(){
	initUpload("url4Flash","admedia","swf","",null,'upload_flash');
	hasInitFlashUpload = true;
}

function fnUploadImagehandler(mediaUrl){
	$j("#advertisementImage").get(0).src=__mediaPath+mediaUrl;
}
function initUpload(fileInputId, uploadCategory, supportedSuffixs, nonsupportedSuffixs, onCompleteHandler, className){
	var urlAction = '/dialog/upload.html?uploadCategory=' + uploadCategory + "&fileInputId=" + fileInputId;
	if (onCompleteHandler) 
		urlAction += "&onCompleteHandler=" + onCompleteHandler.toLocaleString().substring(9, onCompleteHandler.toLocaleString().indexOf("("));
	var plugin_upload_valid = true;
	$j("<input type='button' class='" + className+ "' />").insertAfter("#" + fileInputId).upload({
		name: 'file',
		action: __ctxPath + urlAction,
		enctype: 'multipart/form-data',
		params: {},
		onSubmit: function(){
			return plugin_upload_valid;
		},
		onComplete: function(){
		},
		onSelect: function(){
			plugin_upload_valid = true;
			var idx = this.filename().lastIndexOf(".");
			if (idx == -1 || idx >= this.filename().length) {
				plugin_upload_valid = false;
			}
			var suffix = this.filename().substring(idx + 1, this.filename().length).toLowerCase();
			if (plugin_upload_valid && supportedSuffixs) {
				plugin_upload_valid = (supportedSuffixs.toString().indexOf(suffix) >= 0);
			}
			if (plugin_upload_valid && nonsupportedSuffixs) {
				plugin_upload_valid = (nonsupportedSuffixs.toString().indexOf(suffix) == -1);
			}
			if (!plugin_upload_valid) {
				alert(__FMT.error_upload_unsupport + ":" + supportedSuffixs.toString());
				return false;
			}
		},
		autoSubmit: true
	});
	$j("#" + fileInputId).wrap("<div style='float:left;'></div>");
}
</script>

